<!--
Date: 2025-08-13
Copyright (c) 2025 Industrial Software Feature Database
-->
<template>
  <el-dialog :modelValue="addAssociateRelationShow" title="添加映射关系" width="800" @close="buttonClick('cancel')">
    <div class="form-div">
      <el-form ref="addRelationForm" :model="addRelationForm" label-width="180px" size="small">
        <el-form-item label="参数名" required>
          <el-select v-model="formData.fildId" placeholder="请选择" :disabled="fieldIdDisabled">
            <el-option v-for="item in fildIds" :label="item.label" :value="item.value" :key="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="关联上下游参数名" required>
          <el-cascader
            style="width: 100%"
            :disabled="relationDisable"
            :placeholder="placeholder"
            v-model="formData.relateId"
            :options="relationIds"
            :props="relationType"
            clearable
          />
        </el-form-item>
      </el-form>
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button size="small" type="default" @click="buttonClick('cancel')"> 取消 </el-button>
        <el-button size="small" type="primary" @click="buttonClick('confirm')"> 确认 </el-button>
      </div>
    </template>
  </el-dialog>
</template>


<script>
import { getOperatorParameterConfig, getOperatorOutputParameter, saveOperatorMapParameter, updateOperatorMapParameter } from '@/api/algorithmLibrary';
import { ElMessage } from 'element-plus';
export default {
  props: {
    contextData: {
      type: Object,
      default: () => ({})
    },
    addAssociateRelationShow: {
      type: Boolean
    }
  },
  mounted() {
    // 获取该算子全部参数
    getOperatorParameterConfig({ operatorRefId: this.contextData.operator_ref_id, pageNum: 1, pageSize: 1000, isAsc: 'descending' }).then((res) => {
      let result = res.rows || [];
      let parameters = [];
      result.forEach((item) => {
        parameters.push({ value: item.fieldId, label: item.fieldId });
      });
      this.fildIds = parameters;
    });
    // 获取当前算子对应的上游算子以及上游算子的输出参数列表
    getOperatorOutputParameter({ operatorRefId: this.contextData.operator_ref_id, analysisRefId: this.contextData.analysis_ref_id }).then((res) => {
      if (res.data?.length == 0) {
        this.placeholder = '该算子无可配置上游参数映射关系';
        this.relationDisable = true;
      } else {
        this.databaseToCascaderData(res.data);
      }
    });
  },
  data() {
    return {
      related_field_id: [],
      relationType: { multiple: false },
      fildIds: [],
      fieldIdDisabled: this.contextData?.data?.fieldId ? true : false,
      placeholder: '请选择',
      relationDisable: false,
      relationIds: [],
      formData: {
        fildId: this.contextData?.data?.fieldId || '',
        relateId: [this.contextData?.data?.relatedOperatorRefId || '', this.contextData?.data?.relatedFieldId || '']
      }
    };
  },
  methods: {
    // 按钮事件
    buttonClick(id) {
      if (id == 'cancel') {
        this.$emit('handle-event', {
          name: 'cancel',
          close: 'closeDiv',
          parms: 'add-relation-close'
        });
      } else if (id == 'confirm') {
        //数据校验
        if (!this.formData.fildId) {
          ElMessage({ showClose: true, message: '请选择参数名。', type: 'warning' });
          return;
        }
        if (!this.formData.relateId) {
          ElMessage({ showClose: true, message: '请关联上游参数名。', type: 'warning' });
          return;
        }
        const params = {
          analysisRefId: this.contextData.analysis_ref_id,
          operatorRefId: this.contextData.operator_ref_id,
          fieldId: this.formData.fildId,
          relatedOperatorRefId: this.formData.relateId[0],
          relatedFieldId: this.formData.relateId[1]
        };
        // 新增
        if (this.fieldIdDisabled) {
          updateOperatorMapParameter(params).then(() => {
            ElMessage({ showClose: true, message: '关联成功', type: 'success' });
            this.$emit('handle-event', {
              close: 'closeDiv',
              parms: 'add-relation-close',
              name: 'submit'
            });
          });
        } else {
          saveOperatorMapParameter(params).then(() => {
            ElMessage({ showClose: true, message: '关联成功', type: 'success' });
            this.$emit('handle-event', {
              close: 'closeDiv',
              parms: 'add-relation-close',
              name: 'submit'
            });
          });
        }
      }
    },

    databaseToCascaderData(data) {
      let cascaderData = [];
      data.forEach((item) => {
        let childrenData = [];
        item.operatorFieldIdList.forEach((fieldItem) => {
          childrenData.push({
            label: fieldItem,
            value: fieldItem
          });
        });
        cascaderData.push({
          label: item.operatorName,
          value: item.operatorRefId,
          children: childrenData
        });
      });
      this.relationIds = [...cascaderData];
    }
  }
};
</script>

<style lang="less" scoped>
.form-div {
  height: 300px;
}
/deep/.formlayout .formlayout-label {
  width: 140px;
}
/deep/.formlayout-div .el-select {
  width: 500px;
}
/deep/.formlayout-div .el-input__inner {
  width: 500px;
}
</style>
